import React from 'react'

const Header = () => {
  return (
    <header className="text-center py-12 animate-fade-in">
      <div className="relative">
        {/* 主标题 */}
        <h1 className="text-5xl md:text-6xl font-bold text-ink-800 mb-4 font-chinese hover:text-gold-600 transition-colors duration-500 cursor-default">
          心语国韵
        </h1>
        
        {/* 副标题 */}
        <p className="text-xl md:text-2xl text-ink-600 mb-6 font-calligraphy">
          AI对话中的情绪与诗意
        </p>
        
        {/* 装饰性分割线 */}
        <div className="flex items-center justify-center space-x-4 mb-8">
          <div className="w-16 h-px bg-gradient-to-r from-transparent to-gold-400 animate-pulse-slow"></div>
          <div className="w-2 h-2 bg-gold-400 rounded-full animate-bounce-gentle"></div>
          <div className="w-8 h-px bg-gold-400 animate-pulse-slow"></div>
          <div className="w-2 h-2 bg-gold-400 rounded-full animate-bounce-gentle" style={{animationDelay: '0.5s'}}></div>
          <div className="w-16 h-px bg-gradient-to-l from-transparent to-gold-400 animate-pulse-slow"></div>
        </div>
        
        {/* 描述文字 */}
        <p className="text-ink-500 max-w-2xl mx-auto leading-relaxed">
          倾诉心语，感受诗意。让AI理解您的情绪，用古风诗句回应您的心声。
        </p>
      </div>
    </header>
  )
}

export default Header
